import React, { Component } from "react";
import {
    Icon, Table, Button, Form, Input, DatePicker, Select, Skeleton, Col, Row, Alert
} from "antd";
import moment from 'moment';
import {
    getSchoolLevelByEduIdApi, getCountyPatrolNumRankApi, getCountyInspectNumRankApi, getCountyInspectRatesRankApi, 
    getCountyInspectPointsRankApi, getCountyPatrolRatesRankApi, getCountyPatrolPointsRankApi, getCountyComprehensivePointsRankApi, 
    getCountyDangerDealPointsRankApi, getCountyDangerNumRankApi
} from "../js/edudailystatistics.js";




import * as echarts from 'echarts'
import '../css/bigscreen.css'
import { ConsoleSqlOutlined } from "@ant-design/icons";
import { exportExcel } from "../js/utils.js";

const FormItem = Form.Item;
const RangePicker = DatePicker.RangePicker;

const dateFormat = 'YYYY-MM-DD';

const statisticTypeList = [{
    key: 0,
    type: "平均巡检次数",
    alias: "inspectnum"
}, {
    key: 1,
    type: "平均巡检完成率",
    alias: "inspectrates"
}
, {
    key: 2,
    type: "平均巡检积分",
    alias: "inspectpoints"
}, {
    key: 3,
    type: "平均巡更次数",
    alias: "patrolnum"
}, {
    key: 4,
    type: "平均巡更完成率",
    alias: "patrolrates"
}, {
    key: 5,
    type: "平均巡更积分",
    alias: "patrolpoints"
}, {
    key: 6,
    type: "隐患次数",
    alias: "dangernum"
}, {
    key: 7,
    type: "隐患积分",
    alias: "dangerdealpoints"
}, {
    key: 8,
    type: "平均综合积分",
    alias: "comprehensivepoints"
}]

class countyStatistic extends Component {
    constructor(props) {
        super(props);
        this.state = {
            alertVisible: false, //提示
            confirmLoading: false,
            msg: "", //提交失败时的提示语
            tableLoading: true,
            filteredInfo: null,
            sortedInfo: null,
            tableData: [],
            schoolLevel: [],
            searchChartLoading: true,
            chartSearchData: {},
            startTime: "",
            endTime: "",
            isSearch: false,
            statisticType: "",
            statisticData: "",
            chartAvg: ""
        };
    }
    componentDidMount() {
        this.refreshData();
    }
    getBeforeDayTime() {
        var time = (new Date()).getTime() - 24 * 60 * 60 * 1000;
        var beforeday = new Date(time); // 获取的是前一天日期

        beforeday = beforeday.getFullYear() + "-" + (beforeday.getMonth() + 1 > 9
            ? (beforeday.getMonth() + 1) : "0" + (beforeday.getMonth()+1)) + "-" + (beforeday.getDate() > 9
                ? (beforeday.getDate()) : "0" + (beforeday.getDate())); //字符串拼接转格式：例如2018-08-19
        
        return beforeday
    }
    getBeforeWeekTime() {
        var time = (new Date()).getTime() - 24 * 60 * 60 * 1000 * 7;
        var beforeweek = new Date(time); // 获取的是前一周日期

        beforeweek = beforeweek.getFullYear() + "-" + (beforeweek.getMonth() + 1 > 9
            ? (beforeweek.getMonth() + 1) : "0" + (beforeweek.getMonth() + 1)) + "-" + (beforeweek.getDate() > 9
                ? (beforeweek.getDate()) : "0" + (beforeweek.getDate())); //字符串拼接转格式：例如2018-08-19
        return beforeweek
    }

    refreshData() {
        this.setState({
            tableLoading: true,
            statisticType: "平均巡检次数",
            statisticData: "inspectnum",
        });
        let educationId = parseInt(sessionStorage.getItem("departmentId"))
        let schooltype;
        var startTime = this.getBeforeWeekTime()
        var endTime = this.getBeforeDayTime()
        
        this.getSchoolLevelByEduId(educationId, 1)
        this.getCountyInspectNumRank(educationId, schooltype, startTime, endTime)
    }

    searchSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            this.setState({
                statisticType: statisticTypeList[values.statisticType].type,
                statisticData: statisticTypeList[values.statisticType].alias,
            })
            let educationId = parseInt(sessionStorage.getItem("departmentId"))
            let schooltype = values.schoolLevel;
            switch(values.statisticType){
                case 0 : this.getCountyInspectNumRank(educationId, schooltype, this.state.startTime, this.state.endTime)
                break;
                case 1 : this.getCountyInspectRatesRank(educationId, schooltype, this.state.startTime, this.state.endTime)
                break;
                case 2 : this.getCountyInspectPointsRank(educationId, schooltype, this.state.startTime, this.state.endTime)
                break;
                case 3 : this.getCountyPatrolNumRank(educationId, schooltype, this.state.startTime, this.state.endTime) 
                break;
                case 4 : this.getCountyPatrolRatesRank(educationId, schooltype, this.state.startTime, this.state.endTime) 
                break;
                case 5 : this.getCountyPatrolPointsRank(educationId, schooltype, this.state.startTime, this.state.endTime) 
                break;
                case 6 : this.getCountyDangerNumRank(educationId, schooltype, this.state.startTime, this.state.endTime) 
                break;
                case 7 : this.getCountyDangerPointsRank(educationId, schooltype, this.state.startTime, this.state.endTime) 
                break;
                case 8 : this.getCountyComprehensivePointsRank(educationId, schooltype, this.state.startTime, this.state.endTime) 
                break;
            }
        })
    }

    clearAll = () => {
        this.setState({
            filteredInfo: null,
            sortedInfo: null,
        });
    }

    handleChange = (pagination, filters, sorter) => {
        this.setState({
            filteredInfo: filters,
            sortedInfo: sorter,
        });
    }

    handleSearch = (selectedKeys, confirm) => () => {
        confirm();
    }

    handleSearchReset = clearFilters => () => {
        clearFilters();
    }

    onRef = (ref) => {
        this.child = ref
    }

    searchReset = () => {
        this.props.form.resetFields();
    }

    // 巡检次数
    getCountyInspectNumRank = (educationId, schooltype, startTime, endTime) => {
        getCountyInspectNumRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countyinspectnumrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countyinspectnumrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        inspectnum: item.inspectnum
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.inspectnum);
                    serialList.push(index + 1);
                    
                })
                console.log("=========", countyResult)
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countyinspectnumavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 巡检完成率
    getCountyInspectRatesRank = (educationId, schooltype, startTime, endTime) => {
        getCountyInspectRatesRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countyinspectratesrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countyinspectratesrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        inspectrates: item.inspectrates
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.inspectrates);
                    serialList.push(index + 1);
                    
                })
                console.log("=========", countyResult)
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countyinspectratesavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }
    
    // 巡检积分
    getCountyInspectPointsRank = (educationId, schooltype, startTime, endTime) => {
        getCountyInspectPointsRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countyinspectpointsrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countyinspectpointsrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        inspectpoints: item.inspectpoints
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.inspectpoints);
                    serialList.push(index + 1);
                    
                })
                console.log("=========", countyResult)
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countyinspectpointsavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 巡更次数
    getCountyPatrolNumRank = (educationId, schooltype, startTime, endTime) => {
        getCountyPatrolNumRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countypatrolnumrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countypatrolnumrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        patrolnum: item.patrolnum
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.patrolnum);
                    serialList.push(index + 1);
                    
                })
                console.log("=========", countyResult)
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countypatrolnumavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 巡更完成率
    getCountyPatrolRatesRank = (educationId, schooltype, startTime, endTime) => {
        getCountyPatrolRatesRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countypatrolratesrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countypatrolratesrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        patrolrates: item.patrolrates
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.patrolrates);
                    serialList.push(index + 1);
                    
                })
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countypatrolratesavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 巡更积分
    getCountyPatrolPointsRank = (educationId, schooltype, startTime, endTime) => {
        getCountyPatrolPointsRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countypatrolpointsrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countypatrolpointsrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        patrolpoints: item.patrolpoints
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.patrolpoints);
                    serialList.push(index + 1);
                    
                })
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countypatrolpointsavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 隐患次数
    getCountyDangerNumRank = (educationId, schooltype, startTime, endTime) => {
        getCountyDangerNumRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countydangerdealpointsrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countydangerdealpointsrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        dangernum: item.dangernum
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.dangernum);
                    serialList.push(index + 1);
                    
                })
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countydangernumavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 隐患积分
    getCountyDangerPointsRank = (educationId, schooltype, startTime, endTime) => {
        getCountyDangerDealPointsRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countydangerdealpointsrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countydangerdealpointsrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        dangernum: item.dangernum,
                        dangedealrnum: item.dangedealrnum,
                        dangerdealrates: item.dangerdealrates,
                        dangerdealpoints: item.dangerdealpoints
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.dangerdealpoints);
                    serialList.push(index + 1);
                    
                })
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countydangerdealpointsavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    // 综合积分
    getCountyComprehensivePointsRank = (educationId, schooltype, startTime, endTime) => {
        getCountyComprehensivePointsRankApi(educationId, schooltype, startTime, endTime).then((res) => {
            if(res.data.countycomprehensivepointsrankList.length != 0){
                let tableData = [];
                let departmentName = [];
                let countyResult = [];
                let serialList = [];
                res.data.countycomprehensivepointsrankList.forEach((item, index) => {
                    tableData.push({
                        key: index + 1,
                        departmentName: item.departmentName,
                        comprehensivepoints: item.comprehensivepoints
                    })
                    departmentName.push(item.departmentName);
                    countyResult.push(item.comprehensivepoints);
                    serialList.push(index + 1);
                    
                })
                this.setState({
                    tableData: tableData,
                    searchChartLoading: false,
                    tableLoading: false,
                    alertVisible: false,
                    isSearch: true,
                    startTime: startTime,
                    endTime: endTime,
                    departmentName: departmentName,
                    countyResult: countyResult,
                    serialList: serialList,
                    chartAvg: res.data.countycomprehensivepointsavg
                })
            }
        }).catch((e) => {
            if (e.response) {
                console.info(e.response.data)
                console.info(e.response.status)
                console.info(e.response.headers)
            } else if (e.request) {
                console.info(e.request)
            } else {
                console.info('error', e.message)
            }
            console.info(e.config)
        });
    }

    



    handleSelectTime = (value, dateString) => {
        if (dateString[0] != '' && dateString[1] != '') {
            this.setState({
                startTime: dateString[0],
                endTime: dateString[1],
            })
        }
    }

    getSchoolLevelByEduId(id, allType){
        getSchoolLevelByEduIdApi(id, allType)
            .then((res) => {
                this.setState({
                    schoolLevel: res.data,
                });
            })
    }
    
    render() {
        let schoolLevelOptions = [];
        schoolLevelOptions.push(<Option value={null} key={-1}>全部</Option>)
        if (this.state.schoolLevel.length != 0) {
            schoolLevelOptions.push(this.state.schoolLevel.map((d, index) =>
                <Option value={d.schoolLevel} key={index}>{d.schoolLevel}</Option>
            ))
        }
        let statisticType = [];
        statisticType.push(statisticTypeList.map((d, index) => 
            <Option value={d.key} key={d.key}>{d.type}</Option>
        ))
        let info;
        if(this.state.isSearch){
            switch(this.state.statisticData){
                case "inspectnum": info = (<Alert
                    message="平均巡检次数说明"
                    description={"平均巡检次数=在统计时间范围内，该区县下所有学校的巡检次数之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
                case "inspectrates": info = (<Alert
                    message="平均巡检完成率说明"
                    description={"平均巡检完成率=在统计时间范围内，该区县下所有学校的巡检完成率之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
                case "inspectpoints": info = (<Alert
                    message="平均巡检积分说明"
                    description={"平均巡检积分=在统计时间范围内，该区县下所有学校的巡检积分之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
                case "patrolnum": info = (<Alert
                    message="平均巡更次数说明"
                    description={"平均巡更次数=在统计时间范围内，该区县下所有学校的巡更次数之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
                case "patrolrates": info = (<Alert
                    message="平均巡更完成率说明"
                    description={"平均巡更完成率=在统计时间范围内，该区县下所有学校的巡更完成率之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
                case "patrolpoints": info = (<Alert
                    message="平均巡更积分说明"
                    description={"平均巡更积分=在统计时间范围内，该区县下所有学校的巡更积分之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
                case "dangernum": info = (<Alert
                    message="隐患次数说明"
                    description={"隐患次数=在统计时间范围内，该区县下所有学校发现隐患次数之和"}
                    type="info"
                    showIcon/>)
                break;
                case "dangerdealpoints": info = (<Alert
                    message="隐患积分说明"
                    description={"隐患积分=在统计时间范围内，该区县下所有学校的隐患积分之和"}
                    type="info"
                    showIcon/>)
                break;
                case "comprehensivepoints": info = (<Alert
                    message="平均综合积分说明"
                    description={"平均综合积分=在统计时间范围内，该区县下所有学校的综合积分之和/学校数量"}
                    type="info"
                    showIcon/>)
                break;
            }
        }
        

        const { getFieldDecorator, getFieldValue } = this.props.form;
        let { sortedInfo, filteredInfo } = this.state;
        sortedInfo = sortedInfo || {};
        filteredInfo = filteredInfo || {};
        const columnsSearch = [{
            title: "序号",
            dataIndex: "key",
            key: "key"
        }, {
            title: "区县",
            dataIndex: "departmentName",
            key: "departmentName",
        }, 
        this.state.statisticData == "dangerdealpoints" ? ({
            title:"隐患发现数",
            dataIndex: "dangernum",
            key: "dangernum"
        }) : {}, 
        this.state.statisticData == "dangerdealpoints" ? ({
            title:"隐患处理数",
            dataIndex: "dangedealrnum",
            key: "dangedealrnum"
        }) : {},
        this.state.statisticData == "dangerdealpoints" ? ({
            title:"隐患结案率(%)",
            dataIndex: "dangerdealrates",
            key: "dangerdealrates"
        }) : {}, 
        {
            title: this.state.statisticType,
            dataIndex: this.state.statisticData,
            key: this.state.statisticData,
            // sorter: (a, b) => a.inspectNum - b.inspectNum,
            // sortDirections: ['descend', 'ascend'],

        }]
        let labelCol = {
            sm: { span: 6 },
            xl: { span: 6 },
            xxl: { span: 5 },
        };

        let wrapperCol = {
            sm: { span: 18 },
            xl: { span: 18 },
            xxl: { span: 19 },
        };


        // Excel标题
        let header = [
            {
                title: '序号',
                dataIndex: 'key',
                key: 'key',
            }, {
                title: '区县',
                dataIndex: 'departmentName',
                key: 'departmentName',
            }]
        if(this.state.statisticData == "dangerdealpoints"){
            header.push({
                title:"隐患发现数",
                dataIndex: "dangernum",
                key: "dangernum"
            })
            header.push({
                title:"隐患处理数",
                dataIndex: "dangedealrnum",
                key: "dangedealrnum"
            })
            header.push({
                title:"隐患结案率(%)",
                dataIndex: "dangerdealrates",
                key: "dangerdealrates"
            })
        } else{
            header.push({
                title: this.state.statisticType,
                dataIndex: this.state.statisticData,
                key: this.state.statisticData
            })
        }
            

        return (
            <div style={{ marginBottom: 16 }}>
                <Form style={{
                    padding: '12px',
                    backgroundColor: '#fafafa',
                    borderRadius: 8,
                    marginBottom: 16,
                }}
                    layout="inline"
                    onSubmit={this.searchSubmit}>
                    <Row>
                        <Col span={8}>
                            <FormItem
                                label="截止日期"
                                style={{ width: '100%' }}
                                labelCol={labelCol}
                                wrapperCol={wrapperCol}>
                                {getFieldDecorator("deadline", {
                                    rules: [{
                                        type: 'array',
                                        required: false,
                                    }],
                                    initialValue: [ // 核心代码
                                        moment(this.getBeforeWeekTime(), dateFormat),
                                        moment(this.getBeforeDayTime(), dateFormat),
                                      ],
                          
                                })(
                                    <RangePicker
                                        style={{ width: '100%' }}
                                        format={dateFormat}
                                        onChange={this.handleSelectTime} />
                                )}
                            </FormItem>
                        </Col>
                        <Col span={8}>
                            <FormItem
                                label="学校类型"
                                style={{ width: '100%' }}
                                labelCol={labelCol}
                                wrapperCol={wrapperCol}>
                                {getFieldDecorator("schoolLevel", {
                                    rules: [{
                                        required: false,
                                    }]
                                })(
                                    <Select
                                        allowClear={true}
                                        style={{ width: '100%' }}
                                        placeholder="请选择学校类型">
                                        {schoolLevelOptions}
                                    </Select>
                                )}
                            </FormItem>
                        </Col>
                        <Col span={8}>
                        <FormItem
                                label="统计类型"
                                style={{ width: '100%' }}
                                labelCol={labelCol}
                                wrapperCol={wrapperCol}>
                                {getFieldDecorator("statisticType", {
                                    rules: [{
                                        required: false,
                                    }]
                                })(
                                    <Select
                                        allowClear={true}
                                        style={{ width: '100%' }}
                                        placeholder="请选择统计类型">
                                        {statisticType}
                                    </Select>
                                )}
                            </FormItem>
                        </Col>
                        <Col>
                            <FormItem
                                style={{ float: 'right' }}>
                                <Button type="primary" htmlType="submit">搜索</Button>
                                <Button style={{ marginLeft: 8 }} onClick={this.searchReset}>清空</Button>
                                <Button type="primary" style={{ marginLeft: 8 }} onClick={() =>  {
                                    exportExcel(header, this.state.tableData, this.state.statisticType+"排名.xlsx")
                                    }}>导出Excel
                                </Button>  
                            </FormItem>
                        </Col>
                    </Row>
                </Form>
                <div>
                    {
                        this.state.isSearch ?
                            (
                                <div style={{
                                    marginBottom: 16,
                                    padding: 16,
                                    width: '100%',
                                    height: 350,
                                    border: '1px solid',
                                    borderColor: '#f5f5f5'
                                }}>
                                    <Skeleton loading={this.state.searchChartLoading} active>
                                        <CountyStatisticChart
                                            that={this}
                                            departmentName={this.state.departmentName}
                                            countyResult={this.state.countyResult}
                                            serialList={this.state.serialList}
                                            chartAvg={this.state.chartAvg}
                                            divId={'CountyStatisticChart'}
                                            statisticType={this.state.statisticType}
                                            statisticData={this.state.statisticData} />
                                    </Skeleton>
                                </div>
                            ) : null
                    }
                    {info}
                    <Table
                        dataSource={this.state.tableData}
                        columns={columnsSearch}
                        loading={this.state.tableLoading}
                        locale={{ emptyText: '暂无数据' }}
                        onChange={this.handleChange2}
                        rowClassName={(record, index) => index % 2 === 0 ? "rowOne" : "rowTwo"} />
                </div>
            </div>
        );
    }
}

const CountyStatistic = Form.create()(countyStatistic);


class CountyStatisticChart extends Component {
    constructor(props) {
        super(props);
        this.state = {
            countyResult: props.countyResult || [],
            departmentName: props.departmentName || [],
            serialList: props.serialList || [],
            chartAvg: props.chartAvg || [],
            that: props.that,
            currentIndex: 0,
            divId: props.divId,
            statisticType: props.statisticType || "",
            statisticData: props.statisticData || ""
        };

    }

    componentWillReceiveProps(props) {
        if (props.countyResult.length > 0) {
            this.setState({
                that: props.that,
                countyResult: props.countyResult,
                departmentName: props.departmentName,
                serialList: props.serialList,
                chartAvg: props.chartAvg,
                statisticType: props.statisticType,
                statisticData: props.statisticData
            }, () => {
                this.drawChart()
            })
        }
    }

    componentDidMount() {
        let optionData = [];
        if (this.state.departmentName.length != 0) {
            this.drawChart();
        }
    }




    drawChart() {


      var chart = echarts.init(document.getElementById('CountyStatisticChart'));

      let option = {

            baseOption: {
                timeline: {
                    show: false,
                },
                  title: {
                    text: this.state.statisticType + '排名',
                    left: 'center',
                    top: '10px',
                    subtext:'平均值: ' + this.state.chartAvg,
                    subtextStyle: {
                        fontSize: 16
                    }
                },
                legend: [
                    {
                        left:'5%',
                        padding: 5,
                        data: [{name:this.state.statisticType}]
                    }
                ],
                color: ['#3398DB'],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataZoom: {
                            yAxisIndex: 'none'
                        },
                        dataView: { readOnly: false },
                        magicType: { type: ['line', 'bar'] },
                        saveAsImage: {}
                    }
                },
                grid: {
                    left: '5%',
                    right: '5%',
                    bottom: '50px',
                    top: '90px',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        data: [],
                        axisTick: {
                            alignWithLabel: true
                        },
                        axisLabel: {
                            textStyle: {
                                fontSize: 16
                            }
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        axisLabel: {
                            formatter: '{value}',
                            textStyle: {
                                fontSize: 16
                            }
                        }
                    }
                ],

                series: [
                    { name: this.state.statisticType,  type: 'bar'},

                ],

            },
           
            options: []        
        };
        option.options.push({
            xAxis: {
                data: this.state.departmentName
                
            },
            series: [
                {
                    name: this.state.statisticType,
                    type: 'bar',
                    data: this.state.countyResult,
                    barGap: '100%',
                    barMaxWidth: 25,
                    animation: false,
                    itemStyle:
                        {
                            normal: {
                                color: 'rgb(51, 152, 219)',
                                label: {
                                    show: true, //开启显示
                                    position: 'top', //在上方显示
                                    textStyle: { //数值样式
                                        color: 'black',
                                        fontSize: 14
                                    }
                                }
                            }
                        },
                    showBackground: true,
                    backgroundStyle: {
                        color: 'rgba(180, 180, 180, 0.2)'
                    },
        
                    markPoint: {
                        data: [
                            {
                                type: 'max', name: '最大值'
                            }, {
                                type: 'min', name: '最小值'
                            }
                        ]
                    }
                }
            ]
        })
        chart.setOption(option);
       
        
    }


    render() {
        let chartStyle = {
            height: '100%',
            width: '100%',
        };
        return (<div id={this.state.divId} style={chartStyle} />)
    }
}

export { CountyStatistic }